package com.devo.icecream.ui.diy

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Clear
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.SpanStyle
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.text.withStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.devo.icecream.data.IngredientDto
import com.devo.icecream.data.IngredientsBean
import com.devo.icecream.ui.theme.Grey
import com.devo.icecream.ui.theme.Main
import com.devo.icecream.ui.theme.Pink
import com.devo.icecream.ui.theme.textGreyColor
import com.devo.icecream.utils.noRippleClickable

@Composable
internal fun MenuLayout(
    menus: Map<IngredientDto.CategoryBean, List<IngredientsBean?>> = mapOf(),
    onClear: () -> Unit = {},
    onRemove: (index: Int) -> Unit = {},
    onConfirm: () -> Unit = {},
    totalPower: Double = 0.0,
    totalPrice: Double = 0.0
) {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .clip(RoundedCornerShape(16.dp))
            .background(Color.White),
    ) {

        Column(
            modifier = Modifier
                .padding(32.dp)
                .fillMaxSize(),
        ) {

            Row(
                modifier = Modifier.fillMaxWidth(),
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.SpaceBetween
            ) {

                Text(text = "您的食谱", style = MaterialTheme.typography.h2)

                Text(
                    modifier = Modifier
                        .clip(RoundedCornerShape(50.dp))
                        .noRippleClickable { onClear() }
                        .background(Grey)
                        .padding(vertical = 8.dp, horizontal = 24.dp),
                    text = "清空",
                    style = MaterialTheme.typography.body2.copy(color = textGreyColor)
                )
            }

            Spacer(modifier = Modifier.height(20.dp))
            Text(buildAnnotatedString {
                withStyle(SpanStyle(color = Main)) {
                    append("*")
                }
                withStyle(SpanStyle(fontWeight = FontWeight.Bold)) {
                    append("表示至少选择一项")
                }
            })

            val iterator = menus.iterator()
            LazyColumn(
                modifier = Modifier
                    .weight(1f)
                    .fillMaxWidth()
            ) {
                while (iterator.hasNext()) {
                    val entry = iterator.next()
                    item {
                        Row(
                            modifier = Modifier
                                .padding(top = 16.dp)
                                .padding(vertical = 12.dp),
                            verticalAlignment = Alignment.CenterVertically
                        ) {
                            Text(
                                text = buildAnnotatedString {
                                    if (entry.key.isMust == 1) {
                                        withStyle(
                                            style = SpanStyle(
                                                color = Main,
                                                fontSize = 30.sp,
                                                fontWeight = FontWeight.Bold
                                            )
                                        ) {
                                            append("*")
                                        }
                                    }
                                    append(entry.key.name)
                                },
                                style = MaterialTheme.typography.body1.copy(fontWeight = FontWeight.Bold),
                                overflow = TextOverflow.Ellipsis
                            )
                        }
                    }

                    val list = entry.value

                    itemsIndexed(list) { inx, item ->
                        Box(modifier = Modifier.padding(top = if (inx > 0) 16.dp else 0.dp)) {
                            MenuItem(item = item) {
                                item?.let {
                                    onRemove(it.id)
                                }
                            }
                        }
                    }
                }
            }

            Spacer(modifier = Modifier.height(34.dp))

            Row(
                modifier = Modifier.fillMaxWidth(),
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.SpaceBetween,
            ) {
                Text(
                    text = "总热量",
                    style = MaterialTheme.typography.h3.copy(fontWeight = FontWeight.Normal)
                )

                Text(
                    text = "%.02fKcal".format(totalPower),
                    style = MaterialTheme.typography.h3.copy(fontWeight = FontWeight.Normal)
                )
            }

            Spacer(modifier = Modifier.height(18.dp))

            Row(
                modifier = Modifier.fillMaxWidth(),
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.SpaceBetween,
            ) {
                Text(
                    text = "总金额",
                    style = MaterialTheme.typography.h3.copy(fontWeight = FontWeight.Normal)
                )

                Text(
                    buildAnnotatedString {
                        withStyle(SpanStyle(fontSize = 20.sp)) {
                            append("￥")
                        }
                        append("%.02f".format(totalPrice))
                    },
                    style = MaterialTheme.typography.h3.copy(
                        fontWeight = FontWeight.Normal,
                        color = Main
                    )
                )
            }

            Spacer(modifier = Modifier.height(18.dp))

            Text(
                modifier = Modifier
                    .noRippleClickable { onConfirm() }
                    .fillMaxWidth()
                    .clip(RoundedCornerShape(50.dp))
                    .background(Pink)
                    .padding(horizontal = 24.dp, vertical = 12.dp),
                text = "下单制作",
                textAlign = TextAlign.Center,
                style = MaterialTheme.typography.h3.copy(
                    color = Color.White
                )
            )
        }

    }
}

@Composable
private fun MenuItem(item: IngredientsBean?, onRemove: () -> Unit = {}) {
    if (item == null) {
        Box(
            modifier = Modifier
                .fillMaxWidth()
                .clip(RoundedCornerShape(50.dp))
                .background(Grey)
                .padding(vertical = 12.dp, horizontal = 24.dp),
        ) {
            Text(text = "", style = MaterialTheme.typography.body1)
        }
    } else {

        val color = Pink

        Row(
            modifier = Modifier
                .fillMaxWidth()
                .clip(RoundedCornerShape(50.dp))
                .height(IntrinsicSize.Max)
                .border(width = 1.dp, color = color, shape = RoundedCornerShape(50.dp))
                .background(Grey)
                .padding(start = 24.dp),
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text(
                modifier = Modifier
                    .weight(2f)
                    .padding(vertical = 14.dp),
                text = item.name,
                style = MaterialTheme.typography.body2.copy(color = color)
            )

            Text(
                modifier = Modifier.weight(1f),
                text = "x${item.chose}",
                style = MaterialTheme.typography.body2.copy(color = color),
                textAlign = TextAlign.Center
            )


            Box(
                modifier = Modifier
                    .fillMaxHeight()
                    .noRippleClickable { onRemove() }
                    .weight(1f)
                    .align(Alignment.CenterVertically)
                    .padding(16.dp),
            ) {

                Icon(
                    modifier = Modifier
                        .align(Alignment.Center)
                        .size(24.dp),
                    imageVector = Icons.Filled.Clear,
                    contentDescription = "",
                    tint = color
                )
            }

        }
    }

}
